<!-- <script>
    export default{
        data(){
            return{//created 数据就初始化了
                proPrice:20,
                count:3,
                sum:0
            }
        },

        computed:{//在页面未加载的时候就已经计算出来
             sum(){
                return this.proPrice*this.count
            }
        }
    }
</script> -->

<!-- <template>
    <div>
        商品价格：{{ proPrice }}<br/>
        商品数量：{{ count }}<br/>
        小计：{{ sum }}<br/>
    </div>
</template> -->


<script setup lang="ts">
import { computed ,ref} from 'vue';

let proPrice=ref(30)
let count=ref(3)
let sum=computed(()=>{//computed在加载之前就计算出来
    return proPrice.value*count.value
})
</script>

<template>
    <div>
        商品价格：<input type="text" v-model="proPrice"><br/>
        商品数量：<input type="text" v-model="count"><br/>
        小计：{{ sum }}<br/>
    </div>
</template>